<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%
	pageContext.setAttribute("path", request.getContextPath());
%>

<!DOCTYPE HTML>
<html>
<head>
<title>用户列表</title>
<link href="${path}/css/bootstrap.min.css" rel="stylesheet">
<link href="${path}/css/metisMenu.min.css" rel="stylesheet" />
<link href="${path}/css/dataTables.bootstrap.css" rel="stylesheet" />
<link href="${path}/css/sb-admin-2.css" rel="stylesheet" />
<link href="${path}/css/font-awesome.min.css" rel="stylesheet"
	type="text/css" />
<link href="${path}/css/boot-crm.css" rel="stylesheet" type="text/css" />


</head>

<body>
	<div id="wrapper">
		<nav class="navbar navbar-default navbar-static-top" role="navigation"
			style="margin-bottom: 0">
			<div class="navbar-header">
				<a class="navbar-brand" href="#">后台管理系統</a>
			</div>
			<!-- 导航栏右侧图标部分 -->
			<ul class="nav navbar-top-links navbar-right">
				<!-- 邮件通知 start -->
				<li class="dropdown"><a class="dropdown-toggle"
					data-toggle="dropdown" href="#"> <i
						class="fa fa-envelope fa-fw"></i> <i class="fa fa-caret-down"></i>
				</a>
					<ul class="dropdown-menu dropdown-messages">



					</ul></li>
				<!-- 邮件通知 end -->
				<!-- 任务通知 start -->
				<li class="dropdown"><a class="dropdown-toggle"
					data-toggle="dropdown" href="#"> <i class="fa fa-tasks fa-fw"></i>
						<i class="fa fa-caret-down"></i>
				</a>
					<ul class="dropdown-menu dropdown-tasks">

					</ul></li>
				<!-- 任务通知 end -->
				<!-- 消息通知 start -->
				<li class="dropdown"><a class="dropdown-toggle"
					data-toggle="dropdown" href="#"> <i class="fa fa-bell fa-fw"></i>
						<i class="fa fa-caret-down"></i>
				</a>
					<ul class="dropdown-menu dropdown-alerts">



					</ul></li>
				<!-- 消息通知 end -->
				<!-- 用户信息和系统设置 start -->
				<li class="dropdown"><a class="dropdown-toggle"
					data-toggle="dropdown" href="#"> <i class="fa fa-user fa-fw"></i>
						<i class="fa fa-caret-down"></i>
				</a></li>
				<ul class="">
					<li><a href="#"><i class="fa fa-user fa-fw"></i>
							用户：${ADMIN_SESSION.adminname} </a></li>
					<li><a href="#"><i class="fa fa-gear fa-fw"></i> 系统设置</a></li>
					<li class="divider"></li>
					<li><a href="${path}/logout.action"> <i
							class="fa fa-sign-out fa-fw"></i>退出登录
					</a></li>
				</ul>
				<!-- 用户信息和系统设置结束 -->
			</ul>
			<!-- 左侧显示列表部分 start-->
			<div class="navbar-default sidebar" role="navigation">
				<div class="sidebar-nav navbar-collapse">
					<ul class="nav" id="side-menu">
						<li class="sidebar-search">
							<div class="input-group custom-search-form">
								<input type="text" class="form-control" placeholder="查询内容...">
								<span class="input-group-btn">
									<button class="btn btn-default" type="button">
										<i class="fa fa-search" style="padding: 3px 0 3px 0;"></i>
									</button>
								</span>
							</div>
						</li>
						<li><a href="${path}/user/userInfo" class="active"> <i
								class="fa fa-edit fa-fw"></i>用户管理
						</a></li>
						<li><a href="${path}/fenleiguanli"> <i class="fa fa-dashboard fa-fw"></i>
								分类管理
						</a></li>
						<li><a href="${path}/shangpinguanli"> <i
						class="fa fa-dashboard fa-fw"></i>商品管理
				</a></li>
					</ul>
				</div>
			</div>
			<!-- 左侧显示列表部分 end-->
		</nav>


		<div id="page-wrapper">
		
			<!-- 标题 -->
			<div class="row">
				<div class="col-md-12">
					<h1>用户管理</h1>
				</div>
			</div>
			<!-- 查询 -->
			<div class="panel panel-default">
			<div class="panel-body">
				<form class="form-inline" method="get" 
				      action="${path}/user/findByName">
					<div class="form-group">
						<label for="uName">用户名</label> 
						<input type="text" class="form-control" id="userName" 
						                   value="${uName }" name="uName" />
					</div>
							
					<button type="submit" class="btn btn-primary">查询</button>
				</form>
			</div>
		</div>
			<!-- 按钮 -->
			<div class="row">
				<div class="col-md-4 col-md-offset-8">
					<a class="btn btn-primary" href="${path}/user/toAddUser">新建</a>
				</div>
			</div>
			<!-- 表格  -->
			<div class="row">
				<div class="col-md-12">
					<table class="table table-hover">
						<tr>
							<th>id</th>
							<th>用户名</th>
							<th>密码</th>
							<th>真实名字</th>
							<th>地址</th>
							<th>邮箱</th>
							<th>电话</th>
						</tr>
						<c:forEach items="${pageInfo.list }" var="user">
							<tr>
								<td>${user.uid}</td>
								<td>${user.uname }</td>
								<td>${user.passwd}</td>
								<td>${user.realname}</td>
								<td>${user.addr}</td>
								<td>${user.email}</td>
								<td>${user.phone}</td>

								<td>
									<%-- <a type="button"
									href="${path}/user/getUser?uid=${user.uid}"
									class="btn btn-info btn-sm"> <span
										class="glyphicon glyphicon-pencil" aria-hidden="true"></span>
										编辑
								</a> --%> <%-- 	<a href="#" class="btn btn-danger btn-xs" onclick="delUser(${user.uid})">删除</a> --%>
									<a href="#" class="btn btn-primary btn-xs" data-toggle="modal"
									data-target="#userEdit" onclick="editUser(${user.uid})">修改</a>
									<a type="button" href="${path}/user/delUser?uid=${user.uid}"
									class="btn btn-danger btn-sm"> <span
										class="glyphicon glyphicon-trash" aria-hidden="true"></span>
										删除
								</a>
								</td>
							</tr>
						</c:forEach>
					</table>
				</div>
			</div>

			<hr style="height: 1px; border: none; border-top: 1px solid #ccc;" />
			<!-- 分页导航栏 -->

			<!-- 分页信息 -->
			<div class="row">
				<!-- 分页文字信息，其中分页信息都封装在pageInfo中 -->
				<div class="col-md-6">
					当前第：${pageInfo.pageNum}页，总共：${pageInfo.pages}页，总共：${pageInfo.total}条记录
				</div>

				<!-- 分页条 -->
				<div class="col-md-6">
					<nav aria-label="Page navigation">
						<ul class="pagination">
							<li><a href="${path}/user/userInfo?pn=1">首页</a></li>
							<c:if test="${pageInfo.hasPreviousPage }">
								<li><a
									href="${path}/user/userInfo?pn=${pageInfo.pageNum-1}"
									aria-label="Previous"> <span aria-hidden="true">«</span>
								</a></li>
							</c:if>

							<c:forEach items="${pageInfo.navigatepageNums }" var="page_Num">
								<c:if test="${page_Num == pageInfo.pageNum }">
									<li class="active"><a href="#">${ page_Num}</a></li>
								</c:if>
								<c:if test="${page_Num != pageInfo.pageNum }">
									<li><a href="${path}/user/userInfo?pn=${ page_Num}">${ page_Num}</a></li>
								</c:if>
							</c:forEach>
							<c:if test="${pageInfo.hasNextPage }">
								<li><a
									href="${path}/user/userInfo?pn=${pageInfo.pageNum+1}"
									aria-label="Next"> <span aria-hidden="true">»</span>
								</a></li>
							</c:if>
							<li><a href="${path}/user/userInfo?pn=${pageInfo.pages}">末页</a></li>
						</ul>
					</nav>
				</div>
			</div>
		</div>
	</div>
	<!-- 修改客户模态框 -->
	<div class="modal fade" id="userEdit" tabindex="-1" role="dialog"
		aria-labelledby="myModalLabel">
		<div class="modal-dialog" role="document">
			<div class="modal-content">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal"
						aria-label="Close">
						<span aria-hidden="true">&times;</span>
					</button>
					<h4 class="modal-title" id="myModalLabel">修改用户信息</h4>
				</div>
				<div class="modal-body">
					<form class="form-horizontal" id="edit_user_form">
						<input type="hidden" id="edit_uid" value="${user.uid }" name="Uid" />
						<div class="form-group">
							<label for="edit_uName"  value="${findUserById.Uname }" class="col-sm-2 control-label">用户名</label>
							<div class="col-sm-10">
								<input type="text" class="form-control" id="edit_uName"
									placeholder="用户名" name="Uname" />
							</div>
						</div>
						<div class="form-group">
							<label for="edit_pass" class="col-sm-2 control-label">密码</label>
							<div class="col-sm-10">
								<input type="text" class="form-control" id="edit_pass"
									placeholder="密码" name="Passwd" />
							</div>
						</div>
						<div class="form-group">
							<label for="edit_name" class="col-sm-2 control-label">姓名</label>
							<div class="col-sm-10">
								<input type="text" class="form-control" id="edit_name"
									placeholder="姓名" name="Realname" />
							</div>
						</div>
						<div class="form-group">
							<label for="edit_Addr" class="col-sm-2 control-label">地址</label>
							<div class="col-sm-10">
								<input type="text" class="form-control" id="edit_Addr"
									placeholder="地址" name="Addr" />
							</div>
						</div>
						<div class="form-group">
							<label for="edit_Email" class="col-sm-2 control-label">邮箱</label>
							<div class="col-sm-10">
								<input type="text" class="form-control" id="edit_Email"
									placeholder="邮箱" name="Email" />
							</div>
						</div>
						<div class="form-group">
							<label for="edit_phone" class="col-sm-2 control-label">电话</label>
							<div class="col-sm-10">
								<input type="text" class="form-control" id="edit_phone"
									placeholder="电话" name="Phone" />
							</div>
						</div>

					</form>
				</div>
				<div class="modal-footer">
					<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
					<button type="submit" class="btn btn-primary"
						onclick="updateUser()">保存修改</button>
				</div>
			</div>
		</div>
	</div>
	<script src="${path}/js/jquery-1.11.3.min.js"></script>

<script src="${path}/js/bootstrap.min.js"></script>

<script src="${path}/js/metisMenu.min.js"></script>

<script src="${path}/js/jquery.dataTables.min.js"></script>
<script src="${path}/js/dataTables.bootstrap.min.js"></script>

<script src="${path}/js/sb-admin-2.js"></script>
<script type="text/javascript">
//通过id获取修改的客户信息
function editUser(Uid) {
    $.ajax({
        type:"get",
        url:"${path}/user/getUser",
        data:{"Uid":Uid},
        success:function(data) {
            $("#edit_uid").val(data.Uid);
            $("#edit_uName").val(data.Uname);
            $("#edit_pass").val(data.Passwd);
            $("#edit_name").val(data.Realname);
            $("#edit_Addr").val(data.Addr);
            $("#edit_Email").val(data.Email);
            $("#edit_phone").val(data.Phone);
            
        }
    });
}
// 执行修改客户操作
function updateUser() {
	$.post("${path}/user/updateUser",$("#edit_user_form").serialize(),function(data){
		if(data =="OK"){
			alert("客户信息更新成功！");
			window.location.reload();
		}else{
			alert("客户信息更新失败！");
			window.location.reload();
		}
	});
}


</script>
</body>
</html>
